<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>
<script>
    const map1 = new Map();
    map1.set('key1', 'aaaa');
    map1.set('key2', 'bbbb');
    map1.set(null, '123');
    map1.set('key2', 'cccc');
    map1.set('zhangsan', {
        name: 'zhangsan',
        age: 18,
        sex: '男'
    });
    const fn = () => {
        console.log('fn--------');
    }
    map1.set('fn', fn);
    map1.set(fn, 'this is fn');
    map1.set(NaN, 'not number');
    let val1 = map1.get('key1');
    console.log(val1);
    let val2 = map1.get('key2');
    console.log(val2);
    console.log(map1.get(null));
    console.log(map1.get(NaN));
    let fm = map1.get("fn");
    fm();
    console.log(map1.get(fn));
    //1.map key 可以为任何值
    //2.如果set的key值重复则最后的key的value 会覆盖之前的value
    const map2 = new Map();
    map2.set('key3', 'aaaa1');
    map2.set('key4', 'bbbb1');
    for (let [key, value] of map2) {
        console.log(key, '-----', value);
    }
    for (let [key, value] of map2.entries()) {
        console.log(key, '=', value);
    }
    for (let key of map2.keys()) {
        console.log(key);
    }
    for (let value of map2.values()) {
        console.log(value);
    }
    map2.forEach((key, value) => {
        console.log(key, '=', value);
    })
    const arrMap = [
        ['key1', 'value1'],
        ['key2', 'value2']
    ]
    var mapArr = new Map(arrMap);
    console.log(mapArr);

    var arrmap2 = Array.from(map2);
    console.log(arrmap2);
    var cloneMap = new Map(mapArr);
    console.log(cloneMap);

    const map3 = new Map();
    map3.set('key3', 'aaaa1');
    map3.set('key4', 'bbbb1');
    const map4 = new Map();
    map4.set('key4', '44444');
    map4.set('key5', '55555');
    var collMap = new Map([...map3, ...map4])
    console.log(collMap);
</script>

</html>